<div class="mz-search-filterbox"  ng-show="!isLoading">
    <div class="mz-filterbox-header">
        <h3 class="mz-tvseries-title">{{programType}}查询</h3><span class="mz-tvseries-title-promt">（多选）</span>
        <div class="mz-restore-default"><a href="javascript:void(0);" ng-click="resetData()" class="mz-restore-default-txt">恢复默认筛选条件</a></div>
    </div>
    <form role="form" ng-submit="processForm()">
        <div  class="mz-filterbox-menu">

            <table class="table term-list-table">
                <tbody>
                <tr  class="term-list">
                    <td class="term-list-title"><span>日期范围</span></td>
                    <td class="term-list-content mz-datepicker">
                        <p class="mz-tabtime "><input detect-time-val ng-model="formData.startTime" readonly data-fq-role="start" style="border-right: 0;" type="text" class="form-control" placeholder="开始时间"></p>
                        <p class="mz-tabtime-arrow"><img ng-src="img/arrow.png" style="height: 14px;width: 22px;"/></p>
                        <p class="mz-tabtime"><input detect-time-val ng-model="formData.endTime" readonly data-fq-role="end" style="border-left: 0;"  type="text" class="form-control" placeholder="结束时间"></p>
                    </td>
                </tr>

                <tr  class="term-list">
                    <td class="term-list-title"><span>终端</span></td>
                    <td class="term-list-content">
                        <ul class="mz_category_item list-group">
                            <li  class="list-group-item list-category_item">
                                <label>
                                    <input type="checkbox" name="terminals" hidden ng-checked="selectInfo['terminals']"  ng-click="selectAll('terminals')"><span class="category-item-value">全选</span>
                                </label>
                            </li>
                            <li class="list-group-item list-category_item" data-ng-repeat="terminal in terminals">
                                <label>
                                    <input type="checkbox" name="terminals" ng-model="formData['terminals'][terminal.id]" ng-click="checkSelectAll('terminals')" hidden><span class="category-item-value" ng-bind="terminal.name"></span>
                                </label>
                            </li>
                        </ul>
                    </td>
                </tr>
                <tr  class="term-list">
                    <td class="term-list-title"><span>渠道</span></td>
                    <td class="term-list-content">
                        <ul class="mz_category_item list-group">
                            <li  class="list-group-item list-category_item selected">
                                <label>
                                    <input type="checkbox" name="channels" hidden ng-checked="selectInfo['channels']"  ng-click="selectAll('channels')" ><span class="category-item-value">全选</span>
                                </label>
                            </li>
                            <li  class="list-group-item list-category_item" ng-repeat="channel in channels">
                                <label>
                                    <input type="checkbox" name="channels" hidden ng-model="formData['channels'][channel.id]"  ng-click="checkSelectAll('channels')"><span class="category-item-value" ng-bind="channel.name"></span>
                                </label>
                            </li>
                        </ul>
                    </td>
                </tr>
                <tr  class="term-list">
                    <td class="term-list-title"><span>{{programType}}类型</span></td>
                    <td class="term-list-content">
                        <ul class="mz_category_item list-group">
                            <li  class="list-group-item list-category_item">
                                <label>
                                    <input type="checkbox" name="tvTypes" hidden ng-checked="selectInfo['tvTypes']"  ng-click="selectAll('tvTypes')"  ><span class="category-item-value">全选</span>
                                </label>
                            </li>
                            <li class="list-group-item list-category_item" ng-repeat="tvType in tvTypes">
                                <label>
                                    <input type="checkbox" name="tvTypes" hidden  ng-model="formData['tvTypes'][tvType.id]" ng-click="checkSelectAll('tvTypes')"><span class="category-item-value" ng-bind="tvType.name"></span>
                                </label>
                            </li>
                        </ul>
                    </td>
                </tr>
                <tr  class="term-list">
                    <td class="term-list-title"><span>语言</span></td>
                    <td class="term-list-content">
                        <ul class="mz_category_item list-group">
                            <li  class="list-group-item list-category_item">
                                <label>
                                    <input type="checkbox" name="languages" hidden ng-checked="selectInfo['languages']"  ng-click="selectAll('languages')" ><span class="category-item-value">全选</span>
                                </label>
                            </li>
                            <li class="list-group-item list-category_item" ng-repeat="language in languages">
                                <label>
                                    <input type="checkbox" name="languages" hidden ng-model="formData['languages'][language.id]" ng-click="checkSelectAll('languages')"><span class="category-item-value" ng-bind="language.name"></span>
                                </label>
                            </li>
                        </ul>
                    </td>
                </tr>
                <tr  class="term-list">
                    <td class="term-list-title"><span>地区</span></td>
                    <td class="term-list-content">
                        <ul class="mz_category_item list-group">
                            <li  class="list-group-item list-category_item">
                                <label>
                                    <input type="checkbox" name="regions" ng-checked="selectInfo['regions']"  ng-click="selectAll('regions')" hidden ><span class="category-item-value">全选</span>
                                </label>
                            </li>
                            <li  class="list-group-item list-category_item" ng-repeat="region in regions">
                                <label>
                                    <input type="checkbox" name="regions" hidden ng-model="formData['regions'][region.id]" ng-click="checkSelectAll('regions')"><span class="category-item-value" ng-bind="region.name"></span>
                                </label>
                            </li>

                        </ul>
                    </td>
                </tr>
                <tr  class="term-list">
                    <td class="term-list-title"><span>明星</span></td>
                    <td class="term-list-content mz-cancelable-selectlist">
                        <ul class="mz_category_item list-group selected-stars">

                        </ul>
                        <span ng-click="initAction('star')" class="list-group-item list-category_item mz-moreselect"><a data-toggle="modal" data-target="#choose-stars">+选择明星</a></span>
                    </td>
                </tr>
                <tr  class="term-list">
                    <td class="term-list-title"><span>受众性别</span></td>
                    <td class="term-list-content">
                        <ul class="mz_category_item list-group">
                            <li  class="list-group-item list-category_item">
                                <label>
                                    <input type="checkbox" name="sex"  hidden ng-checked="selectInfo['sex']"  ng-click="selectAll('sex')"><span class="category-item-value">全选</span>
                                </label>
                            </li>
                            <li  class="list-group-item list-category_item" ng-repeat="s in sex">
                                <label>
                                    <input type="checkbox" name="sex" hidden ng-model="formData['sex'][s.id]" ng-click="checkSelectAll('sex')"><span class="category-item-value" ng-bind="s.name"></span>
                                </label>
                            </li>

                        </ul>
                    </td>
                </tr>
                <tr  class="term-list">
                    <td class="term-list-title"><span>受众年龄</span></td>
                    <td class="term-list-content">
                        <ul class="mz_category_item list-group">
                            <li  class="list-group-item list-category_item">
                                <label>
                                    <input type="checkbox" name="ages"  hidden ng-checked="selectInfo['ages']"  ng-click="selectAll('ages')"><span class="category-item-value">全选</span>
                                </label>
                            </li>
                            <li  class="list-group-item list-category_item" ng-repeat="age in ages">
                                <label>
                                    <input type="checkbox" name="ages" hidden ng-model="formData['ages'][age.id]" ng-click="checkSelectAll('ages')"><span class="category-item-value" ng-bind="age.name"></span>
                                </label>
                            </li>
                        </ul>
                    </td>
                </tr>
                <tr  class="term-list">
                    <td class="term-list-title"><span>受众地域</span></td>
                    <td class="term-list-content mz-cancelable-selectlist">
                        <span  class="list-group-item list-category_item"  ng-repeat="city in cities" style="margin-top: 4px;">
                            <label>
                                <input type="checkbox"  name="cities" hidden ng-model="formData['cities'][city.id]"><span  class="category-item-value">{{city.name}}</span>
                            </label>
                        </span>
                        <ul class="mz_category_item list-group selected-cities">

                        </ul>
                        <span ng-click="initAction('city')" class="list-group-item list-category_item mz-moreselect"><a data-toggle="modal" data-target="#choose-region">+选择地域</a></span>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
        <button class="buildNewMission tv-series-searchBtn" type="submit">查询</button>
    </form>



    <!--选择地域弹出框-->
    <div class="modal fade choose-region" id="choose-region" tabindex="-1" role="dialog"
         aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog region-box-par">
            <div class="modal-content choose-region-box">
                <div class="modal-header choose-region-header">
                    <h4 class="modal-title choose-region-title" id="myModalLabel">
                        选择地域
                    </h4>
                            <span class="search-region-group">
                                <span class="glyphicon glyphicon-search"></span>
                                <input class="search-region-input typeahead" type="text" placeholder="搜索地域名称">
                            </span>
                </div>
                <div class="modal-body">
                    <div class="choose-city">
                        <ul id="myTab" class="nav nav-tabs choose-city-tab">
                            <li class="active">
                                <a href="#base-hot-city" data-toggle="tab">
                                    热门
                                </a>
                            </li>
                            <li><a href="#base-province" data-toggle="tab">按省</a></li>
                            <li class="">
                                <a href="#base-city" id="myTabDrop1" class=""
                                   data-toggle="tab">按市
                                </a>
                            </li>
                        </ul>
                        <div id="myTabContent" class="tab-content">
                            <div class="tab-pane fade in active city-boxes" id="base-hot-city">
                                <ul class="mz_category_item list-group hot-cities">
                                    <li  class="list-group-item list-category_item">
                                        <label>
                                            <input type="checkbox" name="cities" hidden ng-checked="selectInfo['cities']"  ng-click="selectAllCity()"><span class="category-item-value">全选</span>
                                        </label>
                                    </li>
                                    <li class="list-group-item list-category_item" ng-repeat="city in hotCities">
                                        <label>
                                            <input type="checkbox" name="cities" ng-click="checkSelectAllCity()" hidden ng-model="formData['cities'][city.id]"><span dynamic-add-ele data-dyn-type="city" class="category-item-value" ng-bind="city.name"></span>
                                        </label>
                                    </li>
                                    <div style="clear:both;"></div>
                                </ul>
                            </div>
                            <div class="tab-pane fade city-boxes" id="base-province">
                                <ul class="mz_category_item list-group hot-cities">
                                    <li class="list-group-item list-category_item" ng-repeat="city in baseProviceCities">
                                        <label>
                                            <input type="checkbox" name="cities" hidden ng-model="formData['cities'][city.id]"><span dynamic-add-ele data-dyn-type="city" class="category-item-value"  ng-bind="city.name"></span>
                                        </label>
                                    </li>
                                    <div style="clear:both;"></div>
                                </ul>
                            </div>
                            <div class="tab-pane fade city-boxes" id="base-city">
                                <div class="alphabet-list-box">
                                    <ul class="alphabet-list">
                                        <li class="" ng-repeat="(alpha,alcities) in alphCities">
                                            <a href="#base-city#acIndex{{alpha | uppercase}}">{{alpha | uppercase}}</a>
                                        </li>
                                        <div style="clear:both;"></div>
                                    </ul>
                                </div>
                                <div class="has-all-city">
                                    <div ng-repeat="(alph,alcities) in alphCities">
                                        <span id="acIndex{{alph | uppercase}}" class="city-initial">{{alph | uppercase}}</span>
                                        <ul class="mz_category_item list-group hot-cities initial-city-list">
                                            <li class="list-group-item list-category_item" ng-repeat="city in alcities track by $index">
                                                <label>
                                                    <input type="checkbox" name="cities" hidden ng-model="formData['cities'][city.id]"><span dynamic-add-ele data-dyn-type="city" class="category-item-value" ng-bind="city.name"></span>
                                                </label>
                                            </li>
                                            <div style="clear:both;"></div>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="city-result">
                        <div class="city-result-title">已选择的地域(<span>0</span>)</div>
                        <div class="selected-city-list">
                            <div class="selected-cont">
                                <ul class="mz_category_item list-group selected-cities">

                                </ul>
                            </div>
                            <span class="remove-all-cities">清空已选地域</span>
                        </div>
                    </div>
                </div>
                <div class="modal-footer choose-city-footer">
                    <div class="select-city-btns">
                        <button data-dismiss="modal" type="button" class="btn btn-primary cancel-select-city">
                            取消
                        </button>
                        <button data-dismiss="modal" type="button" class="btn btn-primary finish-select-city">
                            完成
                        </button>
                    </div>
                </div>
            </div><!-- /.modal-content -->
        </div>
    </div><!--选择地域弹出框结束-->
    <!--选择明星弹出框-->
    <div class="modal fade choose-star" id="choose-stars" tabindex="-1" role="dialog"
         aria-labelledby="starModalLabel" aria-hidden="true">
        <div class="modal-dialog star-box-par">
            <div class="modal-content choose-star-box">
                <div class="modal-header choose-star-header">
                    <h4 class="modal-title choose-star-title" id="starModalLabel">
                        选择明星
                    </h4>
                    <div class="search-star-group">
                        <span class="glyphicon glyphicon-search"></span>
                        <input class="search-star-input typeahead" type="text" placeholder="搜索明星">
                    </div>
                </div>
                <div class="modal-body choose-star-body">
                    <div class="choose-star">
                        <ul id="starTab" class="nav nav-tabs choose-star-tab " >
                            <li ng-repeat="(starType,starts) in starDetails">
                                <a href="#star-category{{$index}}" data-toggle="tab" ng-click="initStarTab(starType)" ng-bind="starType"></a>
                            </li>
                        </ul>
                        <div id="starTabContent" class="tab-content star-tab-content">

                            <div class="tab-pane fade in active star-boxes" ng-init="p_index=$index" id="star-category{{$index}}" ng-repeat="(starType,alphaStars) in starDetails">
                                <div class="alphabet-list-box">
                                    <ul class="alphabet-list" >
                                        <li ng-repeat="(starAlpha,alStars) in alphaStars track by $index" >
                                            <a href="#star-category{{p_index}}#as{{p_index}}Index{{starAlpha | uppercase}}">{{starAlpha | uppercase}}</a>
                                        </li>
                                        <div style="clear:both;"></div>
                                    </ul>
                                </div>
                                <div class="has-all-stars mz-star-selectdom">
                                    <div ng-repeat="(starAlph,alStars) in alphaStars track by $index">
                                        <span class="city-initial" id="as{{p_index}}Index{{starAlph | uppercase}}">{{starAlph | uppercase}}</span>
                                        <ul class="mz_category_item list-group star-names initial-star-list">
                                            <li  class="list-group-item list-category_item" ng-repeat="aStar in alStars track by $index">
                                                <label class="label-for-star">
                                                    <input type="checkbox"  hidden name="stars"  ng-model="formData['stars'][aStar.id]"><span dynamic-add-ele data-dyn-type="star" class="starName-value"  ng-bind="aStar.name" title="{{aStar.name}}"></span>
                                                </label>
                                            </li>
                                            <div style="clear:both;"></div>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="star-result">
                        <div class="star-result-title">已选择的明星(<span>0</span>)</div>
                        <div class="selected-star-list">
                            <div class="selected-cont">
                                <ul class="mz_category_item list-group selected-stars">

                                </ul>
                            </div>
                            <span class="remove-all-stars">清空已选明星</span>
                        </div>
                    </div>
                </div>
                <div class="modal-footer choose-star-footer">
                    <div class="select-city-btns">
                        <button data-dismiss="modal" type="button" class="btn btn-primary cancel-select-city">
                            取消
                        </button>
                        <button data-dismiss="modal" type="button" class="btn btn-primary finish-select-city">
                            完成
                        </button>
                    </div>
                </div>
            </div><!-- /.modal-content -->
        </div>
    </div><!--选择明星弹出框结束-->


</div>